<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>主页</title>
    <#include "/common/base.html" >
    <script type="text/javascript" src="/js/main.js"></script>
    <style>
        .user-main{
            overflow: hidden;
        }
        .cs-north-logo {
            height: 40px;
            margin: 15px 0px 0px 5px;
            display: inline-block;
            color:#000000;font-size:22px;font-weight:bold;text-decoration:none
        }
        .cs-north-con{
            color:#000000;font-size:16px;font-weight:bold;text-decoration:none
        }
    </style>
</head>
<body class="easyui-layout">
    <div data-options="region:'north'" style="height: 100px;border-top-color: transparent;border-left-color: transparent;border-right-color: transparent;">
        <div class="cs-north-logo">Spring Boot</div>
        <p>
        <div class="cs-north-con">${name}            <a href="#" onclick="logout()">登出</a></div>
    </div>
    <div id="p" data-options="region:'west'" title="系统菜单" style="width:290px;">
        <div id="mainMenuDIV" class="easyui-accordion main-menu" data-options="fit:true, border:false,animate:false" style="width:500px;height:300px;">

            <#list menus as menu>
            <div title="${menu.name}" data-options="iconCls:'icon-ok',code: '${menu.code}'" style="overflow:auto;padding:10px;">
                <ul class="easyui-tree menu-tt" id="${menu.code}_tree_UL" data-options="fit:true">
                </ul>
            </div>
            </#list>
            <!--<div title="用户管理" data-options="iconCls:'icon-ok',code: 'userManager'" style="overflow:auto;padding:10px;">-->
                <!--<ul class="easyui-tree menu-tt" id="user_tree_UL" data-options="fit:true">-->
                <!--</ul>-->
            <!--</div>-->
            <!--<div title="权限管理" data-options="iconCls:'icon-ok',code:'authManager'" style="padding:10px;">-->
                <!--<ul class="easyui-tree menu-tt" id="auth_tree_UL" data-options="fit:true">-->
                <!--</ul>-->
            <!--</div>-->
            <!--<div title="菜单管理" style="padding:10px;" data-options="iconCls:'icon-ok',code:'menuManager'" >-->
                <!--<ul class="easyui-tree menu-tt" id="menu_tree_UL" data-options="fit:true">-->
                <!--</ul>-->
            <!--</div>-->
            <!--<div title="角色管理" style="padding:10px;" data-options="iconCls:'icon-ok',code:'roleManager'" >-->
                <!--<ul class="easyui-tree menu-tt" id="role_tree_UL" data-options="fit:true">-->
                <!--</ul>-->
            <!--</div>-->
        </div>
    </div>
    <div data-options="region:'center'" style="overflow: hidden;">
        <div id="easyui-main-con" class="easyui-tabs" data-options="fit:true" border="false" style="overflow: hidden;">
            <div title="About"></div>
        </div>
    </div>
</body>
<script type="text/javascript">
    var $TABS_CON = null;
    $(function(){
        init();
        $TABS_CON = $('#easyui-main-con');
    });
    function init(){
        loadMenu('user_tree_UL', 'userManager');
        //给Accordion添加选中事件
        $('#mainMenuDIV').accordion({
            onSelect: function(title, index){
                var curPanel = $('#mainMenuDIV').accordion('getPanel', index);
                var options = curPanel.panel('options');
                var code = options['code'];
                var menuUL = $(curPanel).find('ul');
                var menuULId = $(menuUL).attr('id');
                console.log('code='+code+"；menuID="+menuULId);
                loadMenu(menuULId, code);

            }
        });
    }
    function logout(){
        art.dialog({
            content: '确定要退出系统吗？',
            ok: function () {
                window.location.href = '/login/logout';
            },
            cancelVal: '关闭',
            cancel: true //为true等价于function(){}
        });
    }
</script>
</html>